<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>

<div class="row">
	<div class="col-sm-9">
		<h4>Facturas <small>({{results.totalItems}} resultados)</small></h4>
		<div ng-if="results.results.length < 1">No se han encontrado resultados</div>
		<ul class="list-group">
			<li class="list-group-item" ng-repeat="result in results.results">
				<a href="#/bills/id/{{result.id}}">
					<span>{{result.billDate.substr(0,10)}} - </span>
					<span ng-if="result.code != null">{{result.code}}</span>
					<span>{{result.sender.name}}</span>
					<span ng-if="result.currentState.stateDefinition.id == 'BillDraft'" class="glyphicon glyphicon-exclamation-sign" title="Borrador"></span>
					<span ng-if="result.currentState.stateDefinition.id == 'BillCancelled'" class="glyphicon glyphicon-fire" title="Cancelada"></span>
				</a>
				<span class="pull-right">
					<a href="#/companies/id/{{result.receiver.id}}">{{result.receiver.name}}</a>
				</span>
			</li>
		</ul>
		<pagination total-items="results.totalItems" page="results.currentPage" items-per-page="results.itemsPerPage" on-select-page="setPage(page)" max-size="10" boundary-links="true" first-text="Primero" previous-text="Anterior" next-text="Siguiente" last-text="Último"></pagination>
	</div>
	<div class="col-sm-3">
		<div>
			<h4>Filtrar resultados</h4>
			<form role="form">
				<div class="form-group">
					<label>Código</label>
					<input type="text" class="form-control input-sm" ng-model="searchCode" placeholder="Código" />
				</div>
				<div class="form-group">
					<label>Establecimiento</label>
					<input type="text" class="form-control input-sm" typeahead="store as store.name for store in stores($viewValue)" ng-model="searchStore" placeholder="Establecimiento" />
				</div>
				<div class="form-group">
					<label>Empresa</label>
					<input type="text" class="form-control input-sm" typeahead="company as company.name for company in companies($viewValue)" ng-model="searchCompany" placeholder="Empresa" />
				</div>
				<div class="form-group">
					<label>Estado</label>
					<select class="form-control input-sm" ng-model="searchState">
						<option value=""></option>
						<option value="BillDraft">Borradores</option>
						<option value="BillConfirmed">Confirmadas</option>
						<option value="BillSent">Enviadas</option>
						<option value="BillCancelled">Canceladas</option>
					</select>
				</div>
				<button class="btn btn-primary btn-sm" ng-click="search()">Buscar</button>
			</form>
		</div>
		<div class="m-top-40">
			<h4>Facturación</h4>
			<ul class="list-unstyled">
				<li><a href="#/bills?state=BillDraft">Ver facturas pendientes</a></li>
				<li><a href="#/bills?state=BillConfirmed">Ver facturas aceptadas</a></li>
				<li><a href="#/bills?state=BillSent">Ver facturas enviadas</a></li>
				<li><a href="#/bills?state=BillCancelled">Ver facturas anuladas</a></li>
			</ul>				
		</div>
		<!-- popup con el json de debug -->
		<div class="m-top-40">
			<button class="btn btn-default btn-sm" data-toggle="modal" data-target="#debugJson">Ver JSON</button>
			<div class="modal fade" id="debugJson" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
				<div class="modal-dialog">
					<div class="modal-content">
						<pre>entity = {{results | json}}</pre>
					</div>
				</div>
			</div>
		</div>
	</div>
</div>

<!-- pre>results = {{results | json}}</pre -->				
	
</body>
</html>